<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <form action=""><button>点击</button></form>
    <form action=""><button>点击</button></form>
    <form action=""><button>点击</button></form>
    <form action=""><button>点击</button></form>
    <br>
    <img src="../images/bzsc-dgbhz-300-250-7-5.gif" alt="">
    <img src="../images/bzsc-dgbhz-300-250-7-5.gif" alt="">
    <img src="../images/bzsc-dgbhz-300-250-7-5.gif" alt="">
    <img src="../images/bzsc-dgbhz-300-250-7-5.gif" alt="">
    <br>
    

    <a href="">111111</a>
    <a href="">111111</a>
    <a href="">111111</a>
    <a href="">111111</a>
</body>
<script>

    // window下的子对象  document(文档对象 window.document)
    // 打开浏览器窗口  window -> document -> html -> body -> 

    // 注意:
    // 1. html页面载入到浏览器中 就会变为文档的一部分
    // 2. 通过document可以获取页面的中所有的元素,操作元素(改变内容 属性 样式 绑定事件 => DOM操作)
    // 3. window下子对象 -> window.document  window可以省略

    console.log(document); // 打印document 内容

    // document的属性和方法

    // 属性: 
    // 了解
    // URL    获取文档对应的url地址
    // all    获取页面中所有元素的集合 
    // forms  获取页面中表单元素的集合 
    // images 获取页面中图片元素的集合 
    // links  获取页面中a标签的集合 
    // script  获取页面中script标签的集合 
    // bgColor 获取和设置文档背景色

    // 记忆:
    // document.documentElement   快捷获取html元素
    // document.body              快捷获取body元素
    // document.head              快捷获取head元素
    // document.title             获取和设置网页标题的内容

    console.dir(document); // 以键值对象形式打印对象的属性和方法

    // console.log(document.all);
    // console.log(document.forms);
    // console.log(document.images);
    // console.log(document.links);
    // console.log(document.scripts);

    // document.bgColor = "grey";

    document.body.style.backgroundColor = "#6ff"

    // console.log( document.title);
    // document.title = "hello world";

    // 了解
    // var body = document.getElementsByTagName("body")[0]
    // body.style.backgroundColor = "#6ff";

    // var div = document.createElement("div"); //新增div元素
    // div.innerText = "我是新增的div";
    // document.body.appendChild(div); //放到body中

   


    // 方法:
    // document.write();
    // document.getElementById()
    // document.getElementsByClassName()
    // document.getElementsByTagName()
    // document.getElementsByName()


</script>
</html>